<template>
	<view class="content">
		<view class="navs">
			<uni-icons type="person-filled" size="30" color="white"></uni-icons>
			<text class="text" style="font-size: 36rpx; color: white;">我的</text>
		</view>
		<view class="mess">
			<view class="mess-left">
				<view style="border-radius: 50%;width: 90rpx;height: 90rpx;background-size: 100%; border: 1px solid #ccc;background-image: url('https://resource.tuniaokj.com/images/skit/video-4.jpg');">
					<!-- <img src="https://resource.tuniaokj.com/images/skit/video-4.jpg" alt=""> -->
				</view>
				<view class="username">
					<view style="color: black;font-size: 34rpx;font-weight: 600;">游客</view>
					<view>
						<text style="color: #999;font-size: 12px;">ID: 24028686</text>
						<!-- <uni-icons type="compose" size="30" ></uni-icons> -->
					</view>
				</view>
			</view>
			<view class="mess-right">
				<uni-icons type="compose" size="30" color="#999"></uni-icons>
			</view>
		</view>
		<view class="list">
			<view class="list1" style="border-radius: 10rpx;padding: 20rpx;">
				<view style="color: rgb(241, 183, 102);font-weight: 700;font-size: 36rpx;margin-left: 20rpx;">华东地区芯片制造厂</view>
				<view style="color: #fff;font-size: 28rpx;margin-top: 30rpx;margin-left: 20rpx;">青岛百杉集团有限公司</view>
			</view>
		</view>
		<view class="hand" style="background-color: white;">
			<view class="handle" style="padding-left: 10rpx;display: flex;align-items: center;margin-top: 30rpx;">
				<uni-icons type="chat-filled" size="20" color="#999"></uni-icons>
				<view style="font-size: 24rpx;font-weight: 600;margin-left: 10rpx;">常见问题</view>
				<view style="color: #ccc;margin-left: 75%;">></view>
			</view>
			<view class="handle" style="padding-left: 10rpx;display: flex;align-items: center;margin-top: 30rpx;">
				<uni-icons type="chat-filled" size="20" color="#999"></uni-icons>
				<view style="font-size: 24rpx;font-weight: 600;margin-left: 10rpx;">在线客服</view>
				<view style="color: #ccc;margin-left: 75%;">></view>
			</view>
			<view class="handle" style="padding-left: 10rpx;display: flex;align-items: center;margin-top: 30rpx;">
				<uni-icons type="chat-filled" size="20" color="#999"></uni-icons>
				<view style="font-size: 24rpx;font-weight: 600;margin-left: 10rpx;">问题反馈</view>
				<view style="color: #ccc;margin-left: 75%;">></view>
			</view>
			<view class="handle" style="padding-left: 10rpx;display: flex;align-items: center;margin-top: 30rpx;">
				<uni-icons type="chat-filled" size="20" color="#999"></uni-icons>
				<view style="font-size: 24rpx;font-weight: 600;margin-left: 10rpx;">技术热线</view>
				<view style="color: #ccc;margin-left: 57%;font-size: 24rpx;color: #000;">134****5273</view>
			</view>
		</view>
		<view class="handle" style="padding-left: 10rpx;display: flex;align-items: center;margin-top: 30rpx;padding-left: 34rpx;background-color: white;height: 94rpx;line-height: 94rpx;">
			<uni-icons type="chat-filled" size="20" color="#999"></uni-icons>
			<view style="font-size: 24rpx;font-weight: 600;margin-left: 10rpx;">退出登录</view>
			
		</view>
		<view>
			<text style="font-size: 24rpx;color: blue;margin-left: 270rpx;">百杉集团</text>
			<text style="font-size: 24rpx;margin-left: 20rpx;">技术支持</text>
		</view>
		<view>
			
			
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {}
		},
		onLoad() {},
		methods: {}
	}
</script>

<style scoped>
	
	.hand{
		margin-top: 20rpx;
		width: 93%;
		margin-left: 20rpx;
		height: 300rpx;
	}
	.list1{
		background: linear-gradient(-120deg, rgb(170, 170, 255), rgb(207, 205, 255), rgb(85, 170, 255), rgb(138, 199, 255));
		width: 88%;
		height: 120rpx;
	}
	.list{
		width: 100%;
		/* padding: 24rpx; */
		margin-left: 20rpx;
	}
	.username{
		margin-left: 20rpx;
	}
	.mess-left {
		display: flex;
	}
	.mess-left img {
		width: 220rpx;
		height: 220rpx;
	}
	.mess {
		margin-top: 30rpx;
		display: flex;
		justify-content: space-between;
		padding: 80rpx 20rpx;
	}
	.content {
		background-color: #f7f7f7;
		height: 100vh;
	}
</style>